<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>头部</title>
    <style>
       .open{
           background-color: rgba(77, 210, 210, 0.73) !important;
       }
    </style>
</head>
<body>
<div th:fragment="header">
    <nav class="navbar navbar-default">
        <div class="container-fluid header">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="sr-only ">码交流</span>

                </button>
                <a class="navbar-brand" >码交流 </a>
            </div>
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <form class="navbar-form navbar-left" action="/index" method="post">
                    <div class="form-group">
                        <input type="text" name="search" class="form-control" placeholder="请输入要搜索的话题...">
                    </div>
                    <button type="submit" class="btn btn-info btn-lg active"><span class="glyphicon glyphicon-search" aria-hidden="true"></span>搜索一下</button>
                </form>
                <ul class="nav navbar-nav ">
                    <script type="text/javascript">
                        function clickNAV(lable) {
                            gtag(
                                'event', 'click',{
                                   'event_category':'LINK',
                                    'event_lable': lable,
                                    'transport_type': NAV
                            })
                        }
    
                    </script>
                    <li >
                        <a th:href="@{${session.NAV.url}}" th:text="${session.NAV.title}" th:onclick="clickNAV(${session.NAV.title})"></a>
                    </li>
                </ul>

                <ul class="nav navbar-nav navbar-right ">

                    <li >
                        <a th:href="@{/}">首页</a>
                    </li>
                    <li th:if="${session.user != null}">
                        <a th:href="@{/publishBlog}">创建个人博客</a>
                    </li>
                    <li th:if="${session.user != null}">
                        <a th:href="@{/publish}" >发布问题</a>
                    </li>
                    <li><a th:href="@{/profile/reply}">通知<span class="badge" th:text="${session.unreadCount}"></span></a></li>
                    <li class="dropdown" th:if="${session.user != null}">

                        <a  id="hello" class="dropdown-toggle my_back" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                            <span class="glyphicon glyphicon-user " aria-hidden="true"></span>
                            <span th:text="${session.name}"></span>
                            <span class="caret font_color "></span></a>
                        <ul class="dropdown-menu">
                            <li><a th:href="@{/profile/questions}">我的问题</a></li>
                            <li><a href="#">个人信息</a></li>
                            <li><a th:href="@{/logOut}" >退出登录</a></li>
                        </ul>
                    </li>
                    <li th:if="${session.user == null}"><a th:href="@{/gitee/auth}">登录</a></li>
                </ul>
            </div>
        </div>
    </nav>
</div>
</body>
</html>